<template>
    <!--<el-container> 作为模板的最外层元素，具有响应式布局-->
    <el-container>
      <el-card class="grey-box" shadow="never">
        <div style="font-size: 10px">@Copyright by Samuel Chan 2024-2025</div>
      </el-card>
    </el-container>
  </template>
  
  <script setup>
  </script>
  
  <style scoped>
  /* scoped限制css样式仅限于本组件,以免造成冲突 */
  .grey-box {
    color: hsl(145, 79%, 49%); /* 文字颜色 */
    height: 30px; /* 设置一个明确的高度，可以根据需要调整 */
    display: flex; /* 使内部元素能够居中对齐 */
    justify-content: center;
    align-items: center;
    padding: 5px;
    position: fixed; /* 设置为固定定位 */
    bottom: 0; /* 距离底部的距离 */
    left: 0; /* 确保占据整个水平空间 */
    right: 0; /* 确保占据整个水平空间 */
    width: 100%; /* 设置宽度为全屏 */
  }
  </style>
  